<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="../css/mui.picker.min.css"/>
		<link rel="stylesheet" type="text/css" href="../css/beiyong.css"/>
		<style type="text/css">
			
			.ic{
				height: 100%;
				display: flex;
				align-items: center;
				font-family: Muiicons;
			    font-size: 18px;
			    line-height: 1;
			    z-index: 20;
			    padding-top: 10px;
			    padding-bottom: 10px;
			    color: #FFFFFF;
			}
			.mmyz{
				width: 100%;
				height: auto;
				position: absolute;
				margin-top: 2%;
			}
			.mmyz .items{ padding:10px; border-bottom: 1px solid white !important;}
			.mmyz input{
				border: 0 !important;
				margin-bottom:0!important;
				padding:0px;
				background-color: #E7EFFE !important;
				
			}
			#address{
				width: 100%;
				/*padding: 10px 15px;*/
				color: #7c7c7c;
			}
			.place button{
				width:100%;
				padding-left:0 !important;padding-right:0 !important;
				text-align: left!important;
				color: #676664 !important;
			    border: 0 !important;
			    font-size:17px;
			    height:40px; line-height: 40px;
			   padding:0!important;
			  /*  border: 1px solid #7DB1FD !important;*/
			}
			.place{
				padding: 0px 15px ;
				
				/* margin-bottom: 15px;*/
				
				border-bottom:1px solid #fff;
			}
			.binp{
				/*border-bottom: 1px solid white !important;*/
				/*padding:15px;*/
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav hbg">
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
		    <h1 class="mui-title">地址设置</h1>
		    <div class="ic mui-icon-right-nav mui-pull-right" onclick="baocun()">保存</div>
		</header>
		<div class="mui-content" id="addapp">
			
			<div class="mmyz" id="shouji">
					<div class="mui-input-row items">
					    <input class="binp" type="text" id="name" placeholder="请输入收货人姓名">
					</div>
					<div class="mui-input-row items">
					    <input class="binp" type="text" id="mobile" placeholder="请输入电话号码">
					</div>
					<div class="place items" >
					    <!--<input name="address" id="address" value="">-->
					   <!--  <button id='showCityPicker3' type="button" class="mui-btn mui-btn-blue">请选择省市区</button>
					    <button id='showCityPicker3' class="mui-btn mui-btn-block" type='button'>请选择省市区</button>-->
					    <button id='showCityPicker3' type="button" class="mui-btn mui-btn-blue mui-btn-outlined">请选择省市区</button>
					</div>
					<div class="mui-input-row items">
					    <input class="binp" type="text" id="deadd" placeholder="请输入详细地址">
					</div>
			</div>
			


			
		</div>
		
		<script src="../js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/mui.min.js"></script>
		<script src="../js/muishow.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/req.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/mui.picker.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/mui.poppicker.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/city.data.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/city.data-3.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
            mui.init();
            var old_blac = mui.back;
            mui.back = function(e){
						var list = plus.webview.getWebviewById("address");
						mui.fire(list,'rest',{});
						old_blac();
				}
            var shen = "", shi = "", qu = "",id="";
            //let id = 16;
            var id = getrequest();
            
            if(id.id){
            	getdata(id.id);
            }
			mui.ready(function(){
				/*id = "21";
            	getdata(id);*/
                var cityPicker3 = new mui.PopPicker({
                    layer: 3
                });
                cityPicker3.setData(cityData3);
                var showCityPickerButton = document.getElementById('showCityPicker3');
                var address = document.getElementById('address');
                showCityPickerButton.addEventListener('tap', function(event) {
                    cityPicker3.show(function(items) {
                    	console.log(items);
                    	shen = (items[0] || {}).text !=undefined ? (items[0] || {}).text : '' ;
                    	shi = (items[1] || {}).text != undefined ? (items[1] || {}).text : '';
                    	qu = (items[2] || {}).text != undefined ? (items[2] || {}).text : '';
                        showCityPickerButton.innerHTML = "" + shen  + " " + shi  + " " + qu ;
                        //返回 false 可以阻止选择框的关闭
                        //return false;
                    });
                }, false);
                
                
                
            });
            
            function baocun(){
            	if(id.id){
            		update(id.id);
            	}else{
            		update();
            	}
            }
            function getdata(id){
            	let data = {
					url:"/api/Address/detail",
					data:{access_token : acctoken()||"",id:id}
					};
				ajax(data,function(res){
					console.log(res);
					if(res.code == -1){
						mui.toast(res.message);
					}
					if(res.code == 1){
						let name = document.getElementById('name');
		            	let mobile = document.getElementById('mobile');
		            	let address = document.getElementById('showCityPicker3');
		            	let deadd = document.getElementById('deadd');
		            	name.value = res.data[0].name;
		            	mobile.value = res.data[0].mobile;
		            	shen = res.data[0].province;
		            	shi = res.data[0].city;
		            	qu = res.data[0].county;
		            	address.innerHTML = "" + shen  + " " + shi  + " " + qu ;
		            	deadd.value = res.data[0].address;
					}
				})
            }
            
            
            
            function update(id){
            	if(!yanz()){
            		return;
            	}
            	let name = document.getElementById('name').value;
            	let mobile = document.getElementById('mobile').value;
            	let address = document.getElementById('showCityPicker3').innerHTML;
            	let deadd = document.getElementById('deadd').value;
            	console.log(address,"address");
				let data = {
					url:"/api/Address/edit",
					data:{
						access_token : acctoken()||"",
						name : name||"",
						mobile : mobile||"",
						province : shen||"",
						city:shi||"",
						county:qu||"",
						address: deadd,
						id:id||"",
					}
				}
				ajax(data,function(res){
					if(res.code == -1){
						mui.toast(res.message);
					}
					if(res.code == 1){
						mui.toast("修改成功");
						mui.back();
						del();
						
					}
				})
			}
            function del(){
            	document.getElementById('name').value = "";
            	document.getElementById('mobile').value = "";
            	document.getElementById('showCityPicker3').innerHTML = "请选择省市区";
            	document.getElementById('deadd').value = "";
            	shen = "";
            	shi = "";
            	qu = "";
            	
            }
            function yanz(){
            	let name = document.getElementById('name').value;
            	let mobile = document.getElementById('mobile').value;
            	let address = document.getElementById('showCityPicker3').innerHTML;
            	let deadd = document.getElementById('deadd').value;
            	
            	if("" == name || null == name || " " == name){
            		mui.toast("请填写收货人姓名");
            		return false;
            	}
            	if("" == mobile || null == mobile || " " == mobile){
            		mui.toast("请填写电话号码");
            		return false;
            	}
            	if("" == shen || null == shen || " " == shen){
            		mui.toast("请填写省，市，区");
            		return false;
            	}
            	if("" == deadd || null == deadd || " " == deadd){
            		mui.toast("请填写详细地址");
            		return false;
            	}
            	return true;
            }
            
            
            
            
			
		</script>
	</body>

</html>